<!DOCTYPE html>
<html>
<head>
    <title>历史</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <#--样式-->
    <link rel="stylesheet" media="screen" href="${request.contextPath}/css/style.css">
    <#--layui-->
    <link rel="stylesheet" media="screen" href="${request.contextPath}/layui/css/layui.css">

</head>
<body >





    <div class="content" >



       <div >
           <#--月亮放置区-->
           <div class="light" style="cursor:pointer;" onclick="window.location.href = '/history/'">
           </div>

           <hr class="line-left">
           <hr class="line-right">

           <div class="main">
               <h1 class="title">历史纪年表</h1>
           </div>




           <div class="textContent" style="padding-bottom: 300px;">

               <#if historyMainList??>
                   <#--先遍历历史主线-->
                   <ul class="layui-timeline" >
                       <#list historyMainList as historyMain>

                           <#--历史时期遍历-->
                           <#if historyMain.periodList??>
                               <li class="layui-timeline-item">
                                   <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                                   <div class="layui-timeline-content layui-text">
                                       <h3 class="layui-timeline-title ">
                                           <p class="textTitleB">
                                               <#list historyMain.periodList as period>
                                                    ${period.start!''}至${period.end!'今天'} ${period.name!''}<br/>
                                               </#list>
                                           </p>
                                       </h3>
                                       <hr class="layui-bg-red">
                                   </div>
                               </li>

                           </#if>



                           <#--常规遍历-->
                           <li class="layui-timeline-item">
                               <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                               <div class="layui-timeline-content layui-text">
                                   <h3 class="layui-timeline-title ">
                                       <#--判断历史主线纪年方式-->
                                       <#if historyMain.ad == 1>
                                           <#if historyMain.accuracy == 1>
                                               <span class="textTitle">约公元元年</span> &nbsp;&nbsp;
                                           <#else >
                                               <span class="textTitle">公元元年</span> &nbsp;&nbsp;
                                           </#if>

                                       <#elseif historyMain.ad < 0>
                                           <#if historyMain.accuracy == 1>
                                               <span class="textTitle">约公元前${historyMain.ad!''}年</span> &nbsp;&nbsp;
                                           <#else >
                                               <span class="textTitle">公元前${historyMain.ad!''}年</span> &nbsp;&nbsp;
                                           </#if>

                                       <#else>
                                           <#if historyMain.accuracy == 1>
                                               <span class="textTitle">约公元${historyMain.ad!''}年</span> &nbsp;&nbsp;
                                           <#else >
                                               <span class="textTitle">公元${historyMain.ad!''}年</span> &nbsp;&nbsp;
                                           </#if>

                                       </#if>

                                       <#--六十甲子-->
                                       <#if (historyMain.sixJiaZi!'')?? && (historyMain.sixJiaZi!'' != '')>
                                           <span class="layui-badge layui-bg-orange">${historyMain.sixJiaZi!''}</span>
                                       </#if>

                                   </h3>

                                   <#--遍历年号-->
                                   <div>
                                       <#if historyMain.reignTitleList??>
                                           <#list historyMain.reignTitleList as reignTitle>
                                               <#if reignTitle??>
                                                   <p class="layui-badge layui-bg-blue ">
                                                       <a class="reignTitle_a" href="/history/other/toUpdReignTitle?id=${reignTitle.id!''}" target="_blank" >${reignTitle.emperor!''} - ${reignTitle.regin!''}</a>
                                                   </p>
                                               </#if>
                                           </#list>
                                       </#if>
                                   </div>
                                   <br/>





                                   <#-- 2019年7月3日22:48:21 第一代
                                   <fieldset class="layui-elem-field">
                                       <legend>年度</legend>
                                       <div class="layui-field-box">
                                           <ul class="textA">
                                               <#if historyMain.yearEvent??>
                                                   <#list historyMain.yearEvent as yearEvent>
                                                       <#if yearEvent??>
                                                           <#if yearEvent.imgPath??>
                                                               <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${yearEvent.imgPath}" >
                                                           </#if>
                                                           <li <#if (yearEvent.important!'') == "2">class="textB"</#if> >
                                                               <a target="_blank" href="/history/event/toUpdEventOccur?id=${yearEvent.id!''}">${yearEvent.content!''}</a>
                                                           </li>
                                                       </#if>
                                                   </#list>

                                               <#else >
                                                   暂无数据
                                               </#if>
                                           </ul>
                                       </div>
                                   </fieldset>-->



                                   <#if historyMain.yearEvent??>
                                       <fieldset class="layui-elem-field">
                                           <legend>年度</legend>
                                           <div class="layui-field-box">
                                               <ul class="textA">
                                                   <#list historyMain.yearEvent as yearEvent>
                                                       <#if yearEvent??>

                                                           <li <#if (yearEvent.important!'') == "2">class="textB"</#if> >
                                                               <a target="_blank" href="/history/event/toUpdEventOccur?id=${yearEvent.id!''}">${yearEvent.content!''}</a>
                                                           </li>

                                                            <#--图片遍历-->
                                                           <#if yearEvent.historyImgList??>
                                                               <#list yearEvent.historyImgList as img>
                                                                   <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${img.path}" onclick="previewImg(this)" >
                                                               </#list>
                                                           </#if>

                                                       </#if>
                                                   </#list>
                                               </ul>
                                           </div>
                                       </fieldset>
                                   </#if>






                                   <#-- 2019年7月3日22:48:21 第一代
                                   <fieldset class="layui-elem-field">
                                       <legend>季节</legend>
                                       <div class="layui-field-box">
                                           <ul class="textA">
                                               <#if historyMain.seasonEvent??>
                                                   <#list historyMain.seasonEvent as seasonEvent>
                                                       <#if seasonEvent??>
                                                           <#if seasonEvent.imgPath??>
                                                               <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${seasonEvent.imgPath}" >
                                                           </#if>
                                                           <li <#if (seasonEvent.important!'') == "2">class="textB"</#if> >
                                                               <a target="_blank" href="/history/event/toUpdEventOccur?id=${seasonEvent.id!''}">
                                                                    <#if (seasonEvent.seasons!'') == "1">
                                                                        春，
                                                                    <#elseif (seasonEvent.seasons!'') == "2">
                                                                        夏，
                                                                    <#elseif (seasonEvent.seasons!'') == "3">
                                                                        秋，
                                                                    <#elseif (seasonEvent.seasons!'') == "4">
                                                                        冬，
                                                                    <#else >
                                                                    </#if>
                                                                   ${seasonEvent.content!''}
                                                               </a>
                                                           </li>

                                                       </#if>
                                                   </#list>

                                               <#else >
                                                   暂无数据
                                               </#if>
                                           </ul>
                                       </div>
                                   </fieldset>-->



                                   <#if historyMain.seasonEvent??>
                                       <fieldset class="layui-elem-field">
                                           <legend>季节</legend>
                                           <div class="layui-field-box">
                                               <ul class="textA">
                                                   <#list historyMain.seasonEvent as seasonEvent>
                                                       <#if seasonEvent??>


                                                           <li <#if (seasonEvent.important!'') == "2">class="textB"</#if> >
                                                               <a target="_blank" href="/history/event/toUpdEventOccur?id=${seasonEvent.id!''}">
                                                                   <#if (seasonEvent.seasons!'') == "1">
                                                                       春，
                                                                   <#elseif (seasonEvent.seasons!'') == "2">
                                                                       夏，
                                                                   <#elseif (seasonEvent.seasons!'') == "3">
                                                                       秋，
                                                                   <#elseif (seasonEvent.seasons!'') == "4">
                                                                       冬，
                                                                   <#else >
                                                                   </#if>
                                                                   ${seasonEvent.content!''}
                                                               </a>
                                                           </li>

                                                       <#--图片遍历-->
                                                           <#if seasonEvent.historyImgList??>
                                                               <#list seasonEvent.historyImgList as img>
                                                                   <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${img.path}" onclick="previewImg(this)" >
                                                               </#list>
                                                           </#if>

                                                       </#if>
                                                   </#list>
                                               </ul>
                                           </div>
                                       </fieldset>
                                   </#if>





                                   <#-- 2019年7月3日22:48:21 第一代
                                   <fieldset class="layui-elem-field">
                                       <legend>日期</legend>
                                       <div class="layui-field-box">
                                           <ul class="textA">
                                               <#if historyMain.dateEvent??>
                                                   <#list historyMain.dateEvent as dateEvent>
                                                       <#if dateEvent??>
                                                           <#if dateEvent.imgPath??>
                                                               <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${dateEvent.imgPath}" >
                                                           </#if>
                                                           <li <#if (dateEvent.important!'') == "2">class="textB"</#if>>
                                                               <#if (dateEvent.dateOccur)?? >
                                                                   <a target="_blank" href="/history/event/toUpdEventOccur?id=${dateEvent.id!''}">${dateEvent.month!''}月${dateEvent.dateOccur!''}日，${dateEvent.content!''}</a>

                                                               <#else >
                                                                   <a target="_blank" href="/history/event/toUpdEventOccur?id=${dateEvent.id!''}">${dateEvent.month!''}月，${dateEvent.content!''}</a>
                                                               </#if>
                                                           </li>

                                                       </#if>
                                                   </#list>
                                               <#else >
                                                   暂无数据
                                               </#if>
                                           </ul>
                                       </div>
                                   </fieldset>-->


                                   <#if historyMain.dateEvent??>
                                       <fieldset class="layui-elem-field">
                                           <legend>日期</legend>
                                           <div class="layui-field-box">
                                               <ul class="textA">
                                                   <#list historyMain.dateEvent as dateEvent>
                                                       <#if dateEvent??>


                                                           <li <#if (dateEvent.important!'') == "2">class="textB"</#if>>
                                                               <#if (dateEvent.dateOccur)?? >
                                                                   <a target="_blank" href="/history/event/toUpdEventOccur?id=${dateEvent.id!''}">${dateEvent.month!''}月${dateEvent.dateOccur!''}日，${dateEvent.content!''}</a>

                                                               <#else >
                                                                   <a target="_blank" href="/history/event/toUpdEventOccur?id=${dateEvent.id!''}">${dateEvent.month!''}月，${dateEvent.content!''}</a>
                                                               </#if>
                                                           </li>

                                                            <#--图片遍历-->
                                                           <#if dateEvent.historyImgList??>
                                                               <#list dateEvent.historyImgList as img>
                                                                   <img style="max-width:100px;max-height:120px;" src="/history/other/read?id=${img.path}" onclick="previewImg(this)">
                                                               </#list>
                                                           </#if>

                                                       </#if>
                                                   </#list>
                                               </ul>
                                           </div>
                                       </fieldset>
                                   </#if>





                               </div>
                           </li>

                       </#list>



                       <#--尾部的图标-->
                       <li class="layui-timeline-item">
                           <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                           <div class="layui-timeline-content layui-text">
                           </div>
                       </li>

                   </ul>




               <#else >
                   <#--没有任何数据-->

                   <ul class="layui-timeline" >
                       <li class="layui-timeline-item">
                           <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                           <div class="layui-timeline-content layui-text">
                               <h3 class="layui-timeline-title "><p class="textTitle">暂无数据</p></h3>
                               <blockquote class="layui-elem-quote layui-quote-nm">
                                   前往添加数据 -----------> <a href="/history/main/toAddMainHistory" class="layui-btn">添加</a>
                               </blockquote>
                           </div>
                       </li>
                   </ul>
                   <ul class="layui-timeline" >
                       <li class="layui-timeline-item">
                           <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                       </li>
                   </ul>

               </#if>



           </div>



       </div>
    </div>




</body>


<!-- scripts -->

<#--layui-->
<script src="${request.contextPath}/layui/layui.js"></script>
<#--js-->
<script src="${request.contextPath}/js/jquery.min.js"></script>


<script>

    // 引入弹出层
    var layer = null;
    layui.use('layer', function(){
        layer = layui.layer;
    });





    /**
     * 预览图片
     * @param obj
     */
    function previewImg(obj) {
        var img = new Image();
        img.src = obj.src;
        var imgHtml = "<div style='text-align:center;'><img style=\"max-width:600px;max-height:480px;\" src='" + obj.src + "' /></div>";
        //捕获页
        layer.open({
            type: 1,
            shade: false,
            title: false, //不显示标题
            //area:['600px','500px'],
            area: [600+'px', 480+'px'],
            content: imgHtml, //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
            cancel: function () {
                //layer.msg('捕获就是从页面已经存在的元素上，包裹layer的结构', { time: 5000, icon: 6 });
            }
        });
    }



</script>



</html>